<template>
  <div class="head">
    <div class="head-img-wrapper">
      <image-view
        :src="src"
        round
      />
    </div>
    <div class="nick-name">lcx</div>

  </div>
</template>
<script>
  import ImageView from '../../components/base/ImageView'

  export default {
    components: {
      ImageView
    },
    mounted () {
    },
    data () {
      return {
        src: 'https://wx.qlogo.cn/mmopen/vi_32/DYAIOgq83eriaBGCiajicX1u1W597ia2N1XhEtuicnlzPuGQppyN49Zt4B5A8euletFCMRUgBvZqA6WuqPNBSK5BUwA/132'
      }
    },
    methods: {}
  }
</script>

<style lang="scss" scoped>
  .head {
    display: flex;
    background: #0087ff;
    padding-top: 10%;
    height: 75px;
    .head-img-wrapper {
      margin-left: 25px;
      width: 100px;
      height: 100px;
      left: 20px;
    }
    .nick-name {
      margin: 30px 0 0 20px;
      font-size: 18px;
      color: white;
      font-weight: 700;
    }
  }
</style>
